*{
    margin: 0;
    padding: 0;
}
$designWidth:375;
$designHeight:667;
@function vw($px){
    @return ($px/$designWidth) * 100vw;
}
@function vh($px){
    @return ($px/$designHeight) * 100vh;
}
.reservation{
    width: 100vw;
    min-height: 100vh;
    background: #ffffff;
    .reservation1{
        .rv-nav-bar__arrow{
            color: black!important;
            font-size: 18px!important;
           }
           .rv-ellipsis{
            font-size: 18px!important;
           }
           .rv-icon-setting-o{
            color: black!important;
            font-size: 18px!important;
           }
    }
    .reservation2{
        padding: 2px 5px;
        // background: red;
        background: #ffffff;
        width: 95%;
        margin: 0 auto;
        display: flex;
        margin-top: vw(5);
        // background: red;
        .reservation2con1{
            margin-top: 5px;
            img{
                width: vw(90);
                height: vh(90);
                border-radius: vw(10);
            }
        }
        .reservation2con2{
            width: vw(255);
            height: vh(70);
            // background: red;
            box-sizing: border-box;
            position: relative;
            margin-left: 10px;
            box-sizing: border-box;
            .reservation2con2p1con{
                font-size: 16px;
                height: vh(32);
                line-height: vh(32);
                // line-height: 25%;
            }
            .reservation2con2p2{
                font-size: 14px;
                color: gray;
                width: 100%;
                height: vh(32);
                line-height: vh(32);
            }
            .reservation2con2p3{
                color: gray;
                font-size: 16px;
                width: 100%;
                height: vh(32);
                line-height: vh(32);
            }
            .reservation2con2p4{
                font-size: 14px;
                color: gray;
                width: 100%;
                height: vh(27);
                line-height: vh(27);
                // line-height: 25%;
            }
            .reservation2con2Ellipsis{
                transform: rotate(90deg);
                position: absolute;
                bottom: 5px;
                right: 5px;
                font-size: 20px;
            }
        }
    }
    .reservation3{
        width: 95%;
        height: 60px;
        margin:  0 auto;
        margin-top: 10px;
        background: #f5f5f5;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-radius: 8px;
        .reservation3left{
            display: flex;
            img{
                width: 60px;
                height: 60px;
                border-radius: 50%;
            }
            .reservation3div{
                margin-left: 15px;
                .reservation3divp1{
                    font-size: 14px;
                    margin-top: 8px;
                }
                .reservation3divp2{
                    font-size: 14px;
                    margin-top: 7px;
                    color: gray;
                    
                }

            }
        }
        
        .reservation3right{
            font-size: 14px;
            text-align: right;
            width: 120px;
            padding: 10px;
            box-sizing: border-box;
        }
        .reservation3right::before{
            content: '信用良好:';
            color: gray;
            font-size: 14px;
        }
    }
    .reservation4{
        margin-top: 10px;
        width: 100vw;
        border-bottom: 10px solid #f5f5f5;
    }
    .reservation5{
        display: flex;
        flex-wrap: wrap;
        // background: red;
        height: 350px;
        .reservation5p{
            margin-top: 10px;
            height: 25px;
            line-height: 25px;
            padding: 0 10px;
        }
        .reservation5con{
            display: flex;
            width: 95%;
            margin: 0 auto;
            height: 60px;
            .reservation5conleft{
                width: 10%;
                height: 60px;
                text-align: center;
                line-height: 60px;
            }
            .reservation5conright{
                width: 90%;
                display: flex;
                flex-wrap: wrap;
                background: #f5f5f5;
                height: 60px;
                border-radius: 10px;
                padding: 0 10px;
                box-sizing: border-box;
                .reservation5conright1{
                    width: 50%;
                    height: 30px;
                    line-height: 35px;
                }
                .reservation5conright2{
                    width: 50%;
                    text-align: right;
                    height: 30px;
                    line-height: 35px;
                    font-size: 14px;
                    // background: red;
                    color: gray;
                }
                .reservation5conright3{
                    width: 100%;
                    height: 30px;
                    line-height: 35px;
                    font-size: 14px;
                    color: gray;
                }
            }
        }
        .style{
            height: 210px;
            border-left: 4px solid #f5f5f5;
            position: absolute;
            left: 25px;
            bottom: 125px;
            // z-index: -1;
        }
        .reservation5bot{
            // background: pink;
            width: 100vw;
            height: 60px;
            position: fixed;
            bottom: 10px;
            display: flex;
            .reservation5botleft{
                width: 20%;
                text-align: center;
                p{
                    font-size: 14px;
                }
            }
            .reservation5botright{
                width: 80%;
                height: 60px;
                display: flex;
                align-items: center;
                justify-content: center;
                button{
                    width: 90%;
                    height: 50px;
                    background: #f5f5f5;
                    font-size: 14px;
                    color: gray;
                    border: none;
                    border-radius: 10px;
                    
                }
            }
        }
        
    }
}
.iconact{
    color: green;
}